<!-- 企业认证核心表单页 -->
<template>
  <div class="company-authentication-verify">
    <div class="verify-status" v-if="showVerifyDiv" :class="[verifyStatus ? 'success' : 'error']">
      <div class="status-text">
        <img :src="computedStatusImg" alt="" />
        <p v-if="verifyStatus">认证通过</p>
        <p v-else>
          审核未通过原因：{{adminInfoDataForm.remark}}
        </p>
      </div>
    </div>
    <header class="header-title">
      <div class="corver">
        <img :src="imgPath.header.info" alt="" />
        <span class="title">管理员资料</span>
        <span class="notify-alert">(*仅限本人操作，管理员信息将与账号个人信息同步)</span>
      </div>
    </header>
    <div class="info-part">
      <!-- 有两个static-info，一个是编辑表单，一个是静态显示 -->
      <div class="static-info" v-if="pageStatus === 'check'">
        <el-row>
          <el-col :span="12">
            <el-col :span="10"><span class="title">企业名称：</span></el-col>
            <el-col :span="14">
              <span class="text">{{adminInfoDataForm.companyName}}</span>
            </el-col>
          </el-col>
          <el-col :span="12">
            <el-col :span="10" v-if="companyType === '101'"><span class="title">登记号：</span></el-col>
            <el-col :span="10" v-else><span class="title">信用代码：</span></el-col>
            <el-col :span="14"
              ><span class="text">{{adminInfoDataForm.creditCode}}</span></el-col
            >
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-col :span="10"><span class="title">管理员姓名：</span></el-col>
            <el-col :span="14"><span class="text">{{adminInfoDataForm.userName}}</span></el-col>
          </el-col>
          <el-col :span="12">
            <el-col :span="10"
              ><span class="title">管理员手机号：</span></el-col
            >
            <el-col :span="14"><span class="text">{{adminInfoDataForm.phone | encryptionPhone}}</span></el-col>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-col :span="10"
              ><span class="title">管理员身份证号：</span></el-col
            >
            <el-col :span="14"
              ><span class="text">{{adminInfoDataForm.idCard | encryptionIdCode}}</span></el-col
            >
          </el-col>
          <el-col :span="12">
            <el-col :span="10"
              ><span class="title">管理员是否为法定代理人：</span></el-col
            >
            <el-col :span="14"><span class="text">{{adminInfoDataForm.isAgent ? '是':'否'}}</span></el-col>
          </el-col>
        </el-row>
      </div>
      <div class="static-info" v-else>
        <el-form :model="adminInfoDataForm" :rules="adminFormRules">
          <el-row>
            <el-col :span="12">
              <el-col :span="10"><span class="title">企业名称：</span></el-col>
              <el-col :span="14">
                <el-form-item prop="companyName">
                  <el-input placeholder="请输入企业名称" @change="changeCompanyName" v-model="adminInfoDataForm.companyName"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="12">
              <el-col :span="10" v-if="companyType === '101'"><span class="title">登记号：</span></el-col>
              <el-col :span="10" v-else><span class="title">信用代码：</span></el-col>
              <el-col :span="14">
                <el-form-item prop="creditCode">
                  <el-input :placeholder="companyType === '101' ? '请输入登记号':'请输入信用代码'" :disabled='true' v-model="adminInfoDataForm.creditCode"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-col :span="10"><span class="title">管理员姓名：</span></el-col>
              <el-col :span="14">
                <el-form-item prop="userName">
                  <el-input placeholder="请输入管理员姓名" v-model="adminInfoDataForm.userName"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="12">
              <el-col :span="10"><span class="title">管理员手机号：</span></el-col>
              <el-col :span="14">
                <el-form-item prop="phone">
                  <el-input  placeholder="请输入管理员手机号" v-model="adminInfoDataForm.phone" :disabled='true'></el-input>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-col :span="10"><span class="title">管理员身份证号：</span></el-col>
              <el-col :span="14">
                <el-form-item prop="idCard">
                  <el-input  placeholder="请输入管理员身的证号" v-model="adminInfoDataForm.idCard"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="12">
              <el-col :span="10"><span class="title">管理员是否为法定代理人：</span></el-col>
              <el-col :span="14">
                <el-form-item prop="isAgent">
                  <el-select  placeholder="请选择是否为法定代理人" v-model="adminInfoDataForm.isAgent">
                    <el-option label="是" :value="1"></el-option>
                    <el-option label="否" :value="0"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <div class="licence-info">
        <div class="corver-licence">
          <id-front :disabled="pageStatus === 'check'" @uploadCb='getUploadIdFrontUrl' :imgUrl='adminInfoDataForm.frontIdCardUrl'/>
          <id-back :disabled="pageStatus === 'check'" @uploadCb='getUploadIdBackUrl' :imgUrl='adminInfoDataForm.backIdCardUrl'/>
          <legal-person :disabled="pageStatus === 'check'" v-if="!adminInfoDataForm.isAgent" @uploadCb='getUploadLegaUrl' :imgUrl='adminInfoDataForm.legalCardUrl'/>
        </div>
        <!-- <div class="placeholder-item" v-for="item in 1" :key="item + 'n'"></div> -->
      </div>
    </div>
    <header class="header-title" v-if="companyDType !== '101003' && nextLevelCategoryKey !== '101003'">
      <div class="corver">
        <img :src="imgPath.header.licence" alt="" />
        <span class="title">证照信息</span>
      </div>
    </header>
    <div class="licence-part">
      <!-- 营业执照 -->
      <business-licence 
        @history='historyCorrespondingLicence' 
        @getBusinessLicenceForm='saveBusinessLicenceData'
        :data='businessLicenceData'
        :adminInfo='adminInfoDataForm'
        :type='pageStatus'
        v-if='businessLicenceVisable'
      ></business-licence>
      <!-- 医疗器械生产许可证 -->
      <medical-device-production-licence
        @history='historyCorrespondingLicence' 
        @getBusinessLicenceForm='saveMedicalDeviceProductionLicenceData'
        :data='medicalDeviceProductionLicence'
        :adminInfo='adminInfoDataForm'
        :type='pageStatus'
        v-if='productionLicenceVisable'
      ></medical-device-production-licence>
      <!-- 医疗器械生产备案凭证 -->
      <medical-device-production-record-certificate-licence
        @history='historyCorrespondingLicence' 
        @getBusinessLicenceForm='saveMedicalDeviceProductionRecordCertificateLicenceData'
        :data='medicalDeviceProductionRecordCertificateLicenceData'
        :adminInfo='adminInfoDataForm'
        :type='pageStatus'
        v-if='productionCertificateLicenceVisable'
      ></medical-device-production-record-certificate-licence>
      <!-- 医疗器械经营许可证 -->
      <medical-device-business-licence
        @history='historyCorrespondingLicence' 
        @getBusinessLicenceForm='saveMedicalDeviceBusinessLicenceData'
        :data='medicalDeviceBusinessLicenceData'
        :adminInfo='adminInfoDataForm'
        :type='pageStatus'
        v-if="medicalDeviceBusinessLicenceVisable"
      ></medical-device-business-licence>
      <!-- 医疗器械经营备案凭证 -->
      <medical-device-business-record-certificate-licence
        @history='historyCorrespondingLicence' 
        @getBusinessLicenceForm='saveMedicalDeviceBusinessRecordCertificateLicenceData'
        :data='medicalDeviceBusinessRecordCertificateLicenceData'
        :adminInfo='adminInfoDataForm'
        :type='pageStatus'
        v-if="medicalCertificateDeviceBusinessLicenceVisable"
      ></medical-device-business-record-certificate-licence>
      <!-- 医疗机构执业许可证 -->
      <medical-institution-practice-licence
        @history='historyCorrespondingLicence' 
        @getBusinessLicenceForm='saveMedicalInstitutionPracticeLicenceData'
        :data='medicalInstitutionPracticeLicenceData'
        :adminInfo='adminInfoDataForm'
        :type='pageStatus'
        v-if="medicalInstitutionPracticeLicenceVisable"
      ></medical-institution-practice-licence>
      <!-- 事业单位法人证书 -->
      <public-institution-legal-person-certificate-licence
        @history='historyCorrespondingLicence' 
        @getBusinessLicenceForm='savePublicInstitutionLegalPersonCertificateLicenceData'
        :adminInfo='adminInfoDataForm'
        :data='publicInstitutionLegalPersonCertificateLicenceData'
        :type='pageStatus'
        v-if="publicInstitutionLegalPersonCertificateLicence"
      ></public-institution-legal-person-certificate-licence>
      <div class="placeholder-item" v-for="item in 4" :key="item + 'm'"></div>
    </div>
    <!-- 证照历史弹窗 -->
    <el-dialog
      :title="historyTitle || '证照'"
      width="1200px"
      :visible.sync="dialogHistoryTableVisible"
    >
      <el-editable
        :data="historyData"
        :columns="historyColumns">
        <template
          slot="default-url"
          slot-scope="scope">
          <icon-font
            v-if="scope.row.url && scope.row.url.includes('pdf')"
            @click.native="licencePreview(scope.row.url)"
            icon="iconpdf"
            class="iconfont"
          />
          <div
            v-else
            v-viewer
            :url="[scope.row.url]">
            <el-image
              class="table-img"
              fit="contain"
              :src="scope.row.url" />
          </div>
        </template>
      </el-editable>
    </el-dialog>
    <!-- 弹窗驳回 -->
    <el-dialog
      title="驳回理由"
      :visible.sync="dialogVisibleReject"
      width="30%"
      :before-close="handleClose">
      <el-form
        :model="rejectForm"
        ref="rejectForm"
        class="demo-ruleForm">
        <el-form-item
          prop="remark"
        >
          <el-input
            type="textarea"
            v-model.number="rejectForm.remark"
            autocomplete="off"/>
        </el-form-item>
      </el-form>
      <span
        slot="footer"
        class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button
          type="primary"
          @click="companyBatchRefuse()">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 审核弹窗 -->
    <el-dialog
      title="企业应用授权"
      :visible.sync="dialogVisibleConfirm"
      width="400px"
      :before-close="handleCloseConfirmDialog">
      <el-form
        :model="confirmForm"
        :rules='confirmFormRules'
        label-width="120px"
        ref="confirmForm"
        class="demo-ruleForm">
        <el-form-item
        label='平台角色'
          prop="companyType"
        >
          <el-select
            v-model="confirmForm.companyType"
            @change='changePlatformType'
            placeholder="请选择平台角色">
            <el-option
              v-for="item in platformEnums"
              :key="item.value"
              :label="item.label"
              :value="item.value"/>
          </el-select>
        </el-form-item>
        <el-form-item
          label='用户组'
          prop="groupId"
        >
          <el-select
            v-model="confirmForm.groupId"
            placeholder="请选择用户组">
            <el-option
              v-for="item in authGroupList"
              :key="item.id"
              :label="item.name"
              :value="item.id"/>
          </el-select>
        </el-form-item>
      </el-form>
      <span
        slot="footer"
        class="dialog-footer">
        <el-button @click="handleCloseConfirmDialog">取 消</el-button>
        <el-button
          type="primary"
          @click="companyBatchConfirm">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import idFront from '@/moduleComponents/licence/card/idFront.vue'
import idBack from '@/moduleComponents/licence/card/idBack.vue'
import legalPerson from '@/moduleComponents/licence/card/legalPerson.vue'
import businessLicence from '@/moduleComponents/licence/card/businessLicence'
import medicalDeviceProductionLicence from '@/moduleComponents/licence/card/medicalDeviceProductionLicence'
import medicalDeviceProductionRecordCertificateLicence from '@/moduleComponents/licence/card/medicalDeviceProductionRecordCertificateLicence'
import medicalDeviceBusinessLicence from '@/moduleComponents/licence/card/medicalDeviceBusinessLicence'
import medicalDeviceBusinessRecordCertificateLicence from '@/moduleComponents/licence/card/medicalDeviceBusinessRecordCertificateLicence'
import medicalInstitutionPracticeLicence from '@/moduleComponents/licence/card/medicalInstitutionPracticeLicence'
import publicInstitutionLegalPersonCertificateLicence from '@/moduleComponents/licence/card/publicInstitutionLegalPersonCertificateLicence'
import ElEditable from '@components/el-editable/door/index.vue'
import { 
  merchantUserGetAdminByCompany,
  merchantUserIdentityGetByUserId,
  merchantUserUpdateUserIdentityInfo,
  identityOCR,
  getAuthGroupList,
  commonGetAllEnums
} from '@const/api_staffCenter.js'

import { 
  companyGetCompanyBaseAndCertificateInfoVO, // 企业详情
  companyNewCommit, // 提交接口
  companyNewSaveDraft, // 保存接口
  findHisPage, // 历史记录
  treeAcCompany2017BusinessScopeVO,
  treeAcCompany2002BusinessScopeVO,
  companyNewBatchReject,
  companyNewBatchPass
} from '@api/auth_center_v1.js'
import {selectByHospitalNameOrNumber} from '@const/externalDataSource.js'
import {qichachaCompanyName} from '@api/interface_center_v1.js'
import {getAuthGroupByCompany, authGroupGetAuthGroupList} from '@api/m_staff_center_v1.js'
import {historyColumns} from './const'
import { throttle, hasIn } from 'lodash';

export default {
  name: 'companyAuthenticationVerify',
  components: {
    idFront, // 身份证正面
    idBack,
    legalPerson,
    businessLicence,
    medicalDeviceProductionLicence,
    medicalDeviceProductionRecordCertificateLicence,
    medicalDeviceBusinessLicence,
    medicalDeviceBusinessRecordCertificateLicence,
    medicalInstitutionPracticeLicence,
    publicInstitutionLegalPersonCertificateLicence,
    ElEditable
  },
  data() {
    return {
      historyColumns,
      imgPath: {
        header: {
          info: require('@assets/img/company-verify/pc-qyrz-glyzl-icon.png'),
          licence: require('@assets/img/company-verify/pc-qyrz-zzxx-icon.png')
        },
        licence: {
          idFront: require('@assets/img/company-verify/pc-qyrz-glyzl-sfzzm-bg.png'),
          idBack: require('@assets/img/company-verify/pc-qyrz-glyzl-sfzbm-bg.png'),
          auth: require('@assets/img/company-verify/pc-qyrz-glyzl-sqssc-bg.png'),
          add: require('@assets/img/company-verify/jxt-qyre-zzxx-tj-icon.png')
        },
        status: {
          success: require('./pc-qyrz-rztg-icon.png'),
          error: require('./pc-qyrz-shwtg-icon.png')
        }
      },
      adminInfoDataForm:{
        isAgent: 0,
        idCard: '',
        phone: '',
        userName: '',
        creditCode: '',
        companyName: '',
        frontIdCardUrl: '',
        backIdCardUrl: '',
        legalCardUrl: '',
        remark: '',
        companyBaseHisId: ''
      }, // 管理员资料表单数据
      adminFormRules: {}, // 管理员资料表单验证规则
      businessLicenceData: null, // 营业执照数据
      medicalDeviceProductionLicence: null, // 医疗器械生产许可证数据
      medicalDeviceProductionRecordCertificateLicenceData: null, // 医疗器械生产备案凭证
      medicalDeviceBusinessLicenceData: null,//医疗器械经营许可证
      medicalDeviceBusinessRecordCertificateLicenceData: null, // 医疗器械经营备案凭证
      medicalInstitutionPracticeLicenceData: null, // 医疗机构职业许可证
      publicInstitutionLegalPersonCertificateLicenceData: null, // 事业单位法人证书
      pageStatus: 'create',
      historyData: [], // 证照历史数据
      dialogHistoryTableVisible: false, // 证照历史显隐
      historyTitle: '',
      nextLevelCategoryKey: '', // 本来应该从路由传的，自己拿吧这里
      dialogVisibleConfirm: false,
      authGroupList: [],
      platformEnums: [],
      confirmForm: {
        companyType: '',
        groupId: ''
      },
      confirmFormRules: {
        companyType: [
          { required: true, message: '请选择企业类型', trigger: 'blur' },
        ],
        groupId: [
          { required: true, message: '请选择用户组', trigger: 'blur' },
        ]
      },
      dialogVisibleReject: false,
      rejectForm: {
        remark: ''
      },
      companyTypeOld: ''
    }
  },
  filters:{
    encryptionPhone(phoneNumber) {
      return phoneNumber ? phoneNumber.replace(/([0-9]{3})([0-9]{6})([0-9]{2})/, '$1******$3') : '';
    },
    encryptionIdCode(idCode) {
      return idCode ? idCode.replace(/([0-9]{6})([0-9]{10})([0-9]{2})/, '$1**********$3') : '';
    }
  },
  computed: {
    // 证照的显隐逻辑
    // 营业执照
    businessLicenceVisable() {
      return ['100','102','103','104','105','101002'].includes(String(this.routeCompanyType))
    },
    // 医疗器械生产许可证,医疗器械生产备案凭证
    productionLicenceVisable() {
      return ['100','105'].includes(String(this.routeCompanyType))
    },
    // 医疗器械生产备案凭证
    productionCertificateLicenceVisable() {
      return ['100','105'].includes(String(this.routeCompanyType))
    },
    // 医疗器械经营许可证,医疗器械经营备案凭证
    medicalDeviceBusinessLicenceVisable() {
      return ['100','102','105'].includes(String(this.routeCompanyType))
    },
    // 医疗器械经营备案凭证
    medicalCertificateDeviceBusinessLicenceVisable() {
      return ['100','102','105'].includes(String(this.routeCompanyType))
    },
    // 医疗机构执业许可证
    medicalInstitutionPracticeLicenceVisable() {
      return ['101001','101002'].includes(String(this.routeCompanyType))
    },
    // 事业单位法人证书
    publicInstitutionLegalPersonCertificateLicence() {
      return ['101001'].includes(String(this.routeCompanyType))
    },
    // 这个用来判断是否请求详情接口，
    // 唉。其实这些状态写的复杂了，有些可以重用的，以后这些状态的流转在开始开发之前就要设计好
    isEdit() {
      if(this.$route.query.companyBaseHisId) {
        return true
      }
      return false
    },
    // 这两个就是传给后端的企业type值
    routeCompanyType() {
      if(this.$route.query.dtype) {
        return String(this.$route.query.dtype)
      } else {
        return String(this.$route.query.type)
      }
    },
    companyType() {
      return String(this.$route.query.type)
    },
    companyDType() {
      return String(this.$route.query.dtype || '')
    },
    // 用于全局性按钮显示逻辑的判断
    itemStatus() {
      return this.$route.query.status
    },
    // 认证是否通过状态
    // 这个状态仅是验证成功或失败两种状态值
    /*
      FIRST_WAIT(0, "从未通过待审批"),
      PASSED(1, "审批通过"),
      NOT_PASSED(2, "审批驳回"),
      PASSED_WAIT(3, "通过后再提交待审批"),
      SECOND_NOT_PASSED(4, "通过后再提交被驳回"),
      DRAFT(5, "草稿状态");
    */ 
    verifyStatus() {
      if(['1'].includes(String(this.$route.query.approveStatusKey))) {
        return true
      }
      if(['2','4'].includes(String(this.$route.query.approveStatusKey))) {
        return false
      }
    },
    showVerifyDiv() {
      return this.pageStatus !== 'create' && !['0','3','5'].includes(String(this.$route.query.approveStatusKey))
    },
    // 跟verifyStatus使用的功能范围是一样的
    computedStatusImg() {
      if (this.verifyStatus) return this.imgPath.status.success
      return this.imgPath.status.error
    },
  },
  mounted() {
    // 设置pageStatus
    // 理论上来讲，分为create创建和edit编辑，check查看
    this.pageStatus = this.$route.query.pageStatus || 'create'

    this.initGlobalBtn()
    if(this.isEdit) this.getLicencesDetail()
    this.getAdminInfoByCompany()
    this.getAdminIdCardUrl()
    if(this.$route.query.actionStatus&&this.$route.query.actionStatus === '0')this.getAllEnumsPlatform()
  },
  methods: {
    saveBusinessLicenceData(data) {
      this.businessLicenceData = data
    },
    saveMedicalDeviceProductionLicenceData(data) {
      this.medicalDeviceProductionLicence = data
    },
    saveMedicalDeviceProductionRecordCertificateLicenceData(data) {
      this.medicalDeviceProductionRecordCertificateLicenceData = data
    },
    saveMedicalDeviceBusinessLicenceData(data) {
      this.medicalDeviceBusinessLicenceData = data
    },
    saveMedicalDeviceBusinessRecordCertificateLicenceData(data) {
      this.medicalDeviceBusinessRecordCertificateLicenceData = data
    },
    saveMedicalInstitutionPracticeLicenceData(data) {
      this.medicalInstitutionPracticeLicenceData = data
    },
    savePublicInstitutionLegalPersonCertificateLicenceData(data) {
      this.publicInstitutionLegalPersonCertificateLicenceData = data
    },
    changeCompanyName(value) {
      if(this.companyType === '101') {
        this.changeHospitalName(value);
      } else {
        this.$axios({
          method: 'get',
          url: qichachaCompanyName,
          params:{
            companyName: value
          }
        }).then(res => {
          if(res.data.code === '0') {
            let result = res.data.payload
            this.adminInfoDataForm.creditCode = result.creditCode
          } else {
            this.$message({
              type: 'warning',
              message: res.data.msg
            })
          }
        }).catch(err => {
          // this.$message({
          //   type:'warning',
          //   message: err.data.msg
          // })
        })
      }
    },
    changeHospitalName(value) {
      this.$axios({
        method: 'get',
        url: selectByHospitalNameOrNumber,
        params:{
          keyword: value
        }
      }).then(res => {
        let result = res.data.payload
        this.adminInfoDataForm.creditCode = result.hospitalRegistrationNumber
        if(!this.adminInfoDataForm.creditCode) {
          this.$message({
            type: 'warning',
            message: '无法查到医院信息，请联系管理员'
          })
        }
      })
    },
    historyCorrespondingLicence(data) {
      if(!data.id) return
      this.$axios({
        method: 'get',
        url: findHisPage,
        params:{
          id: data.id
        }
      }).then(res => {
        this.historyData = res.data.payload 
        this.dialogHistoryTableVisible = true
      })
    },
    getBusinessScope2002(businessScope2002) {
      return new Promise((resolve,reject) => {
        this.$axios({
          url: treeAcCompany2002BusinessScopeVO,
          method: 'get'
        }).then(res => {
          let option = hasIn(res, ['data', 'payload']) ? res.data.payload : []
          let storage = [];
          option.forEach(item => {
            item.nextNodeList && item.nextNodeList.forEach(it => {
              if(businessScope2002.includes(String(it.id))) {
                storage.push([it.level,it.id])
              }
            })
          })
          resolve(storage)
        }).catch(err => {
          reject(err)
        })
      })
    },
    getBusinessScope2017(businessScope2017) {
      return new Promise((resolve,reject) => {
        this.$axios({
          url: treeAcCompany2017BusinessScopeVO,
          method: 'get',
        }).then(res => {
          let option = hasIn(res, ['data', 'payload']) ? res.data.payload : []
          let storage = [];
          option.forEach(item => {
            item.nextNodeList && item.nextNodeList.forEach(it => {
              if(businessScope2017.includes(String(it.id))) {
                storage.push([it.level,it.id])
              }
            })
          })
          resolve(storage)
        }).catch(err => {
          reject(err)
        })
      })
    },
    // 获取证照详情
    getLicencesDetail() {
      this.$axios({
        method: 'get',
        url: `${companyGetCompanyBaseAndCertificateInfoVO}/${this.$route.query.companyBaseHisId}`
      }).then(res => {
        let result = res.data.payload
        this.companyTypeOld = result.companyTypeOld || ''
        this.businessLicenceData = result.businessLicenceVO // 营业执照
        this.medicalDeviceProductionLicence =  result.manufactureLicenceVO // 医疗器械生产许可证数据
        this.medicalDeviceProductionRecordCertificateLicenceData = result.manufactureRecordCertificateVO // 医疗器械生产备案凭证
        this.medicalDeviceBusinessLicenceData = result.operationLicenceVO //医疗器械经营许可证
        this.medicalDeviceBusinessRecordCertificateLicenceData = result.operationRecordCertificateVO // 医疗器械经营备案凭证
        this.medicalInstitutionPracticeLicenceData = result.medicalInstitutionLicenceVO // 医疗机构职业许可证
        this.publicInstitutionLegalPersonCertificateLicenceData = result.legalPersonCertificateVO // 事业单位法人证书
        // 其他管理员资料信息
        this.adminInfoDataForm.isAgent = result.adminIsLegalAgent || 0
        this.adminInfoDataForm.companyName = result.companyName
        this.adminInfoDataForm.legalCardUrl = result.letterAttorneyUrl
        this.adminInfoDataForm.creditCode = result.unifiedSocialCreditCode
        this.adminInfoDataForm.remark = result.remark
        this.adminInfoDataForm.companyBaseHisId = result.companyBaseHisId

        this.nextLevelCategoryKey = String(result.nextLevelCategoryKey)
        // 医疗器械经营许可证经营范围数据反显改造
        result.operationLicenceVO && this.getBusinessScope2017(result.operationLicenceVO.businessScope2017IdList).then(res => {
          this.medicalDeviceBusinessLicenceData.businessScope2017IdList = res
        }).catch(() => {
          this.medicalDeviceBusinessLicenceData.businessScope2017IdList = []
        })
        result.operationLicenceVO && this.getBusinessScope2002(result.operationLicenceVO.businessScope2002IdList).then(res => {
          this.medicalDeviceBusinessLicenceData.businessScope2002IdList = res
        }).catch(() => {
          this.medicalDeviceBusinessLicenceData.businessScope2002IdList = []
        }) 
        // 医疗器械经营备案凭证经营范围数据反显改造
        result.operationRecordCertificateVO && this.getBusinessScope2017(result.operationRecordCertificateVO.businessScope2017IdList).then(res => {
          this.medicalDeviceBusinessRecordCertificateLicenceData.businessScope2017IdList = res
        }).catch(() => {
          this.medicalDeviceBusinessRecordCertificateLicenceData.businessScope2017IdList = []
        })
        result.operationRecordCertificateVO && this.getBusinessScope2002(result.operationRecordCertificateVO.businessScope2002IdList).then(res => {
          this.medicalDeviceBusinessRecordCertificateLicenceData.businessScope2002IdList = res
        }).catch(() => {
          this.medicalDeviceBusinessRecordCertificateLicenceData.businessScope2002IdList = []
        }) 
      })
    },
    // 获取上传后的图片信息
    getUploadIdFrontUrl(data) {
      this.adminInfoDataForm.frontIdCardUrl = data.payload
      this.$axios({
        method: 'post',
        url: identityOCR,
        data:{
          imgUrl: this.adminInfoDataForm.frontIdCardUrl,
          cardSide: 'FRONT'
        }
      }).then(res => {
        let result = res.data.payload;
        if (res.data.code === '0' && result.identityId) {
          this.adminInfoDataForm.userName = result.name
          this.adminInfoDataForm.idCard = result.identityId
          this.adminInfoDataForm.address = result.address
          this.adminInfoDataForm.birthDate = result.birthDate
          this.adminInfoDataForm.nation = result.nation
          this.adminInfoDataForm.gender = result.gender
        }
      })
    },
    getUploadIdBackUrl(data) {
      this.adminInfoDataForm.backIdCardUrl = data.payload
      this.$axios({
        method: 'post',
        url: identityOCR,
        data:{
          imgUrl: this.adminInfoDataForm.backIdCardUrl,
          cardSide: 'BACK'
        }
      }).then(res => {
        let result = res.data.payload;
        if (res.data.code === '0' && result.issueOffice) {
           this.adminInfoDataForm.issueOffice = result.issueOffice
           this.adminInfoDataForm.startDate = result.startDate
           this.adminInfoDataForm.endDate = result.endDate
        }
      })
    },
    getUploadLegaUrl(data) {
      this.adminInfoDataForm.legalCardUrl = data.payload
    },
    // 从其他子项目跳转进来的，重写返回按钮
    back() {
      let originUrl = window.location.origin.includes('.com') ? window.location.origin : 'https://md.heng-tai.com.cn'
      let pathUrl = originUrl + '/guoke-deepexi-channel-pc/#/basicData/enterprise/list'
      window.location.href = pathUrl
    },
     // 全局按钮的设置
    initGlobalBtn() {
      let saveBtn = { val: '保存', type: 'primary',handle: this.saveResult}
      let submitBtn = {val: '提交',type: 'primary',handle: this.submitResult}
      let editBtn = {val: '编辑',type: 'primary',handle: this.editEve}
      // 原来叫变更，现在叫编辑
      let recallBtn = {val: '编辑',type: 'primary',handle: this.recallEve}
      let toExamineBtns = [
        {val: '审核',type: 'primary',handle: this.companyBatchAudit},
        {val: '拒绝',type: 'warning',handle: this.companyBatchReject}
      ]
      let obj = {
        type: 'btn',
        arr: []
      }
      if(this.pageStatus === 'create') {
        obj.arr = [saveBtn,submitBtn]
      } else {
        if(this.itemStatus === 'change') {
          obj.arr = [recallBtn]
        }
        if(this.itemStatus === 'edit') {
          obj.arr = [editBtn]
        }
        if(this.$route.query.actionStatus) {
          obj.arr = [{type: 'button', val: '返回', handle: this.back}]
          if(this.$route.query.actionStatus === '0') {
            obj.arr = obj.arr.concat(toExamineBtns)
          }
          
        }
      }
      this.$store.commit('changeLayoutHandle', obj)
    },
    recallEve() {
      let submitBtn = {val: '提交',type: 'primary',handle: this.submitResult}
      let obj = {
        type: 'btn',
        arr: []
      }
      obj.arr = [submitBtn]
      this.$store.commit('changeLayoutHandle', obj)
      this.pageStatus = 'edit'
    },
    editEve() {
      let submitBtn = {val: '提交',type: 'primary',handle: this.submitResult}
      let obj = {
        type: 'btn',
        arr: []
      }
      obj.arr = [submitBtn]
      this.$store.commit('changeLayoutHandle', obj)
      this.pageStatus = 'edit'
    },
    saveResult: throttle(
      function () {
        if(!this.checkRequired())return
        let finallyResult = {
          adminIsLegalAgent:this.adminInfoDataForm.isAgent, // 管理员是否是法定代理人 1–是，0–否
          buScope:'', // 经营范围
          companyBaseHisId: this.adminInfoDataForm.companyBaseHisId,  // 认证历史表id
          companyCategory: this.companyType, // 企业类型 100–原厂，101–医疗机构，102–企业，103–第三方服务/审计公司，104–服务商
          nextLevelCategory: this.companyDType || '', // 企业类型细分 101001–公立医院，101002–私立医院，101003–军队医院
          companyName: this.adminInfoDataForm.companyName, // 企业或医疗机构名称
          creditCodeOrRegisterNum: this.adminInfoDataForm.creditCode, // 信用代码或医疗机构登记号
          letterAttorneyUrl: this.adminInfoDataForm.legalCardUrl, //委托书url
          businessLicenceForm:(Object.keys(this.businessLicenceData || {}).length && !!(this.businessLicenceData && this.businessLicenceData.creditCode)) ? {
            ...this.businessLicenceData,
            effectiveness: this.businessLicenceData.effectivenessKey
          } : null,	// 营业执照对象
          manufactureLicenceForm: (Object.keys(this.medicalDeviceProductionLicence || {}).length && !!(this.medicalDeviceProductionLicence && this.medicalDeviceProductionLicence.licenceCode)) ? {
            ...this.medicalDeviceProductionLicence,
            effectiveness: this.medicalDeviceProductionLicence.effectivenessKey
          } : null, // 医疗器械生产许可证
          manufactureRecordCertificateForm: (Object.keys(this.medicalDeviceProductionRecordCertificateLicenceData || {}).length && !!(this.medicalDeviceProductionRecordCertificateLicenceData && this.medicalDeviceProductionRecordCertificateLicenceData.certificateCode)) ? {
            ...this.medicalDeviceProductionRecordCertificateLicenceData,
            effectiveness: this.medicalDeviceProductionRecordCertificateLicenceData.effectivenessKey
          } : null, // 医疗器械生产备案凭证
          operationLicenceForm: (Object.keys(this.medicalDeviceBusinessLicenceData || {}).length && !!(this.medicalDeviceBusinessLicenceData && this.medicalDeviceBusinessLicenceData.licenceCode)) ? {
            ...this.medicalDeviceBusinessLicenceData,
            businessScope2002IdList: this.medicalDeviceBusinessLicenceData.businessScope2002IdList ? this.medicalDeviceBusinessLicenceData.businessScope2002IdList.map(item => item[1]) : [],
            businessScope2017IdList: this.medicalDeviceBusinessLicenceData.businessScope2017IdList ? this.medicalDeviceBusinessLicenceData.businessScope2017IdList.map(item => item[1]) : [],
            effectiveness: this.medicalDeviceBusinessLicenceData.effectivenessKey
          } : null, // 医疗器械经营许可证
          operationRecordCertificateForm: (Object.keys(this.medicalDeviceBusinessRecordCertificateLicenceData || {}).length && !!(this.medicalDeviceBusinessRecordCertificateLicenceData && this.medicalDeviceBusinessRecordCertificateLicenceData.certificateCode)) ? {
            ...this.medicalDeviceBusinessRecordCertificateLicenceData,
            businessScope2002IdList: this.medicalDeviceBusinessLicenceData.businessScope2002IdList ? this.medicalDeviceBusinessRecordCertificateLicenceData.businessScope2002IdList.map(item => item[1]) : [],
            businessScope2017IdList: this.medicalDeviceBusinessLicenceData.businessScope2017IdList ? this.medicalDeviceBusinessRecordCertificateLicenceData.businessScope2017IdList.map(item => item[1]) : [],
            effectiveness: this.medicalDeviceBusinessRecordCertificateLicenceData.effectivenessKey
          } : null, // 医疗器械经营备案凭证
          medicalInstitutionLicenceForm: (Object.keys(this.medicalInstitutionPracticeLicenceData || {}).length && !!(this.medicalInstitutionPracticeLicenceData && this.medicalInstitutionPracticeLicenceData.registerNum)) ? {
            ...this.medicalInstitutionPracticeLicenceData,
            effectiveness: this.medicalInstitutionPracticeLicenceData.effectivenessKey
          } : null, // 医疗机构执业许可证
          legalPersonCertificateForm: (Object.keys(this.publicInstitutionLegalPersonCertificateLicenceData || {}).length && !!(this.publicInstitutionLegalPersonCertificateLicenceData && this.publicInstitutionLegalPersonCertificateLicenceData.creditCode)) ? {
            ...this.publicInstitutionLegalPersonCertificateLicenceData,
            effectiveness: this.publicInstitutionLegalPersonCertificateLicenceData.effectivenessKey
          }:null // 事业单位法人证书
        }
        // 注意，拼凑的是表单数据，详情数据只是为了在非编辑状态下的显示，并无提交关联
        this.submitBaseAdminInfo().then(res => {
          if(res.data.code === '0') {
            this.$axios({
              method: 'post',
              url: companyNewSaveDraft,
              data: finallyResult
            }).then(res => {
              if(res.data.code === '0') {
                this.adminInfoDataForm.companyBaseHisId = res.data.payload
                this.$message({
                  type: 'success',
                  message:'保存成功'
                })
              }
            }).catch(err => {
              // this.$message({
              //   type: 'warning',
              //   message:err.data.msg
              // })
            })
          } else {
            this.$message({
              type: 'warning',
              message: '信息保存失败'
            })
          }
        }).catch(err => {
          // this.$message({
          //   type: 'warning',
          //   message: err.data.msg
          // })
        })
      },
      3000,
      {
        leading: true,
        trailing: false
      }
    ),
    submitBaseAdminInfo() {
      return new Promise((reslove,reject) => {
        this.$axios({
          method: 'post',
          url: merchantUserUpdateUserIdentityInfo,
          data: {
            identityId: this.adminInfoDataForm.idCard,
            identityFront: this.adminInfoDataForm.frontIdCardUrl,
            identityBack: this.adminInfoDataForm.backIdCardUrl,
            agentAuthUrl: this.adminInfoDataForm.legalCardUrl,
            name: this.adminInfoDataForm.userName,
            isAgent: this.adminInfoDataForm.isAgent,
            address: this.adminInfoDataForm.address,
            birthDate: this.adminInfoDataForm.birthDate,
            nation: this.adminInfoDataForm.nation,
            gender: this.adminInfoDataForm.gender,
            issueOffice: this.adminInfoDataForm.issueOffice,
            startDate: this.adminInfoDataForm.startDate,
            endDate: this.adminInfoDataForm.endDate
          }
        }).then(res => {
          reslove(res)
        }).catch(err => {
          reject(err)
        })
      })
    },
    checkRequired() {
      if(!this.adminInfoDataForm.creditCode) {
          this.$message({
            type: 'warning',
            message: this.companyType === '101'?'登记号为必填项': '统一社会信用代码必填'
          })
          return false
       }
      return true
    },
    submitResult: throttle(
      function () {
        if(!this.checkRequired())return
        // 注意，拼凑的是表单数据，详情数据只是为了在非编辑状态下的显示，并无提交关联
        let finallyResult = {
          adminIsLegalAgent:this.adminInfoDataForm.isAgent, // 管理员是否是法定代理人 1–是，0–否
          buScope:'', // 经营范围
          companyBaseHisId: this.adminInfoDataForm.companyBaseHisId,  // 认证历史表id
          companyCategory: this.companyType, // 企业类型 100–原厂，101–医疗机构，102–企业，103–第三方服务/审计公司，104–服务商
          nextLevelCategory: this.companyDType || '', // 企业类型细分 101001–公立医院，101002–私立医院，101003–军队医院
          companyName: this.adminInfoDataForm.companyName, // 企业或医疗机构名称
          creditCodeOrRegisterNum: this.adminInfoDataForm.creditCode, // 信用代码或医疗机构登记号
          letterAttorneyUrl: this.adminInfoDataForm.legalCardUrl, //委托书url
          businessLicenceForm: (Object.keys(this.businessLicenceData || {}).length && !!(this.businessLicenceData && this.businessLicenceData.creditCode)) ? {
            ...this.businessLicenceData,
            effectiveness: this.businessLicenceData.effectivenessKey,
          } : null,	// 营业执照对象
          manufactureLicenceForm: (Object.keys(this.medicalDeviceProductionLicence || {}).length && !!(this.medicalDeviceProductionLicence && this.medicalDeviceProductionLicence.licenceCode)) ? {
            ...this.medicalDeviceProductionLicence,
            effectiveness: this.medicalDeviceProductionLicence.effectivenessKey
          } : null, // 医疗器械生产许可证
          manufactureRecordCertificateForm: (Object.keys(this.medicalDeviceProductionRecordCertificateLicenceData || {}).length && !!(this.medicalDeviceProductionRecordCertificateLicenceData && this.medicalDeviceProductionRecordCertificateLicenceData.certificateCode)) ? {
            ...this.medicalDeviceProductionRecordCertificateLicenceData,
            effectiveness: this.medicalDeviceProductionRecordCertificateLicenceData.effectivenessKey
          } : null, // 医疗器械生产备案凭证
          operationLicenceForm: (Object.keys(this.medicalDeviceBusinessLicenceData || {}).length && !!(this.medicalDeviceBusinessLicenceData && this.medicalDeviceBusinessLicenceData.licenceCode)) ? {
            ...this.medicalDeviceBusinessLicenceData,
            businessScope2002IdList: this.medicalDeviceBusinessLicenceData.businessScope2002IdList.map(item => item[1]),
            businessScope2017IdList: this.medicalDeviceBusinessLicenceData.businessScope2017IdList.map(item => item[1]),
            effectiveness: this.medicalDeviceBusinessLicenceData.effectivenessKey
          } : null, // 医疗器械经营许可证
          operationRecordCertificateForm: (Object.keys(this.medicalDeviceBusinessRecordCertificateLicenceData || {}).length &&  !!(this.medicalDeviceBusinessRecordCertificateLicenceData && this.medicalDeviceBusinessRecordCertificateLicenceData.certificateCode)) ? {
            ...this.medicalDeviceBusinessRecordCertificateLicenceData,
            businessScope2002IdList: this.medicalDeviceBusinessRecordCertificateLicenceData.businessScope2002IdList.map(item => item[1]),
            businessScope2017IdList: this.medicalDeviceBusinessRecordCertificateLicenceData.businessScope2017IdList.map(item => item[1]),
            effectiveness: this.medicalDeviceBusinessRecordCertificateLicenceData.effectivenessKey
          } : null, // 医疗器械经营备案凭证
          medicalInstitutionLicenceForm: (Object.keys(this.medicalInstitutionPracticeLicenceData || {}).length && !!(this.medicalInstitutionPracticeLicenceData && this.medicalInstitutionPracticeLicenceData.registerNum)) ? {
            ...this.medicalInstitutionPracticeLicenceData,
            effectiveness: this.medicalInstitutionPracticeLicenceData.effectivenessKey
          } : null, // 医疗机构执业许可证
          legalPersonCertificateForm: (Object.keys(this.publicInstitutionLegalPersonCertificateLicenceData || {}).length && !!(this.publicInstitutionLegalPersonCertificateLicenceData && this.publicInstitutionLegalPersonCertificateLicenceData.creditCode)) ? {
            ...this.publicInstitutionLegalPersonCertificateLicenceData,
            effectiveness: this.publicInstitutionLegalPersonCertificateLicenceData.effectivenessKey
          }:null // 事业单位法人证书
        }
        this.submitBaseAdminInfo().then(res => {
          if(res.data.code === '0') {
            this.getAdminIdCardUrl()
            this.$axios({
              method: 'post',
              url: companyNewCommit,
              data: finallyResult
            }).then(res => {
              if(res.data.code === '0') {
                this.$message({
                  type: 'success',
                  message:'提交成功'
                })
                this.$router.push('/company/authentication/list')
              }
            }).catch(err => {
              console.log(err,'err')
              // this.$message({
              //   type: 'warning',
              //   message: err.data.msg
              // })
            })
          }
        }).catch(err => {
          // this.$message({
          //   type: 'warning',
          //   message: err.data.msg
          // })
        })
      },
      3000,
      {
        leading: true,
        trailing: false
      }
    ),
    // 获取基本管理员信息
    getAdminInfoByCompany() {
      console.log(this.$store.state.companyId,'this.$store.state.companyId')
      this.$axios({
        method: 'get',
        url: merchantUserGetAdminByCompany,
        params: {
          companyId: this.$route.query.companyId || this.$store.state.companyId,
          userId: this.$route.query.userId || ''
        }
      }).then(res => {
        let result = res.data.payload

        this.adminInfoDataForm.idCard = result.idCard;
        this.adminInfoDataForm.phone = result.phone;
        this.adminInfoDataForm.userName = result.userName;
      }).catch(err => {
      })
    },
    // 获取用户证照图片
    getAdminIdCardUrl() {
      this.$axios({
        method: 'get',
        url: merchantUserIdentityGetByUserId,
        params: {
          userId: this.$route.query.userId || this.$store.state.userId
        }
      }).then(res => {
        let data = res.data.payload
        // this.adminInfoDataForm.isAgent = data.isAgent
        this.adminInfoDataForm.frontIdCardUrl = data.identityFront
        this.adminInfoDataForm.backIdCardUrl = data.identityBack
        // this.adminInfoDataForm.legalCardUrl = data.agentAuthUrl

      }).catch(err => {
      })
    },
    // 预览pdf
    licencePreview(url) {
      this.$pdfViewer({ url, title: 'PDF预览' })
    },
    // 审核通过
    companyBatchAudit () {
      this.setcompanyId()
      this.dialogVisibleConfirm = true
    },

    setcompanyId() {
      this.confirmForm.companyType = this.companyTypeOld
      let companyId = this.$route.query.companyId || this.$store.state.companyId
      this.getAuthGroupByCompany(companyId)
    },

      // 获取用户组id
    getAuthGroupByCompany(companyId) {
      this.$axios({
        method: 'get',
        url: `${getAuthGroupByCompany}?companyId=${companyId}`
      }).then( async res => {
       let companyType = res.data && res.data.payload && res.data.payload.companyType || ''
        let groupId = res.data.payload.authGroupId || ''
        await this.getGroup(companyType)
        await this.setConfirmForm(companyType, groupId)
      }).catch(err => {
       
      })
    },

    setConfirmForm(companyType, groupId) {
      this.confirmForm.companyType = companyType
      this.confirmForm.groupId = groupId
    },

     // 获取 用户组
    getGroup(companyType) {
      this.$axios({
        method: 'get',
        url: authGroupGetAuthGroupList,
        params: {
          companyType: companyType
        }
      }).then(res => {
        let result = res.data.payload || []
        this.authGroupList = result
        
      }).catch(err => {
        this.authGroupList = []
      })

    },

    // 审核驳回操作
    companyBatchReject () {
      this.rejectForm.remark = ''
      this.dialogVisibleReject = true
    },

    handleClose () {
      this.$refs['rejectForm'].resetFields()
      this.dialogVisibleReject = false
    },
    handleCloseConfirmDialog () {
      this.dialogVisibleConfirm = false
      this.confirmForm = {
        companyType: '',
        groupId: ''
      }
    },
    changePlatformType () {
      this.confirmForm.groupId = ''
      this.$axios({
        method: 'get',
        url: getAuthGroupList,
        params: {
          companyType: this.confirmForm.companyType
        }
      }).then(res => {
        let result = res.data.payload || []
        this.authGroupList = result
      }).catch(err => {
        this.authGroupList = []
      })
    },
    getAllEnumsPlatform () {
      this.$axios({
        method: 'get',
        url: commonGetAllEnums
      }).then(res => {
        let result = res.data.payload || []
        this.platformEnums = result.companyTypeEnum
      }).catch(err => {
        this.platformEnums = []
      })
    },
    // 审核通过的调用接口的方法
    companyBatchConfirm () {
      this.$axios({
        method: 'post',
        url: companyNewBatchPass,
        data: {
          coBaseHisIdList: [this.$route.query.companyBaseHisId],
          companyType: this.confirmForm.companyType,
          groupId: this.confirmForm.groupId
        }
      }).then(res => {
        if (res.data.code === '0') {
          this.$message.success('操作成功')
          this.back()
        }
      }).finally(() => {
        this.dialogVisibleConfirm = false
      })
    },
    // 审核拒绝的接口的方法
    companyBatchRefuse () {
      this.$axios({
        method: 'post',
        url: companyNewBatchReject,
        data: {
          coBaseHisIdList: [this.$route.query.companyBaseHisId],
          remark: this.rejectForm.remark
        }
      }).then(res => {
        if (res.data.code === '0') {
          this.$message.success('操作成功')
          this.back()
        }
      }).finally(() => {
        this.dialogVisibleReject = false
      })
    },
  }
}
</script>
<style lang="less">
.company-authentication-verify {
  overflow: auto;
  .verify-status {
    min-height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 10px;
    .status-text {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      img {
        width: 34px;
        height: 34px;
        margin-right: 20px;
      }
      p {
        font-family: PingFangSC-Regular;
        font-size: 14px;
        letter-spacing: 0;
      }
    }
  }
  .error {
    color: #e63937;
    background: rgba(230, 57, 55, 0.14);
  }
  .success {
    color: #52c419;
    background: rgba(82, 196, 25, 0.18);
  }
  .header-title {
    box-sizing: border-box;
    height: 54px;
    padding: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e6e6e6;
    .corver {
      height: 54px;
      display: flex;
      align-items: center;
      img {
        width: 16px;
        height: 16px;
      }
      .title {
        font-size: 16px;
        color: #333;
        letter-spacing: 0;
        margin-left: 10px;
      }
      .notify-alert{
        color: #e63937;
        font-size: 14px;
        margin-left: 10px;
      }
    }
  }
  .info-part {
    box-sizing: border-box;
    padding: 28px 96px;
    .static-info {
      .el-input__inner{
        width: 255px;
      }
      .title {
        font-size: 14px;
        color: #999;
        letter-spacing: 0;
        text-align: right;
        line-height: 30px;
        display: inline-block;
        width: 100%;
      }
      .text {
        font-size: 14px;
        color: #333;
        letter-spacing: 0;
        line-height: 30px;
        margin-left: 26px;
      }
    }
    .licence-info {
      margin-top: 40px;
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      .corver-licence{
        width: 73%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        flex-wrap: no-wrap;
      }
      .card-item {
        width: 220px;
        height: 156px;
        border: 1px solid red;
      }
      .placeholder-item {
        width: 220px;
        height: 0;
        font-size: 0;
        overflow: hidden;
      }
    }
  }
  .licence-part {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 6px;
    padding: 10px;
    box-sizing: border-box;
    .licence-item {
      width: 380px;
      height: 240px;
      margin-top: 20px;
      border: 1px solid red;
    }
    .placeholder-item {
      width: 380px;
      height: 0;
      font-size: 0;
      overflow: hidden;
    }
    [class $= "-card"] {
      margin-top: 10px;
    }
  }
  .table-img{
    width: 80px;
    height: 80px;
  }
}
@media screen and (max-width: 1300px) {
  .company-authentication-verify .info-part .licence-info .corver-licence{
    width: 87%;
  }
}
</style>
